
h3 {
    text-align: center;
}

.wrapper {
    width: 80%;
    border: 1px solid blue;
    margin: auto;
}

.row,
.title {
    display: flex;
    align-items: center;
    margin: 10px;
}

.title {
    height: 30px;
    font-weight: bold;
    background: #dfdfdf;
}

.row .ordinal,
.title .ordinal {
    flex-basis: 10%;
    text-align: center;
}

.row .username,
.title .username {
    flex-basis: 20%;
}

.row .nickname,
.title .nickname {
    flex-basis: 20%;
}

.row .reg-date,
.title .reg-date {
    flex-basis: 30%;
    text-align: center;
}

.row .operations,
.title .operations {
    flex-basis: 20%;
    text-align: center;
}

.row .operations a {
    display: inline-block;
    padding: 5px;
    border: 1px solid blue;
    border-radius: 3px;
    background: #3232ff;
    color: #ffffff;
    text-decoration: none;
    user-select: none;
}

.row .operations a:hover {
    background: #2525bd;
    color: #ffff00;
}

.links {
    text-align: center;
    margin: 15px auto;
}

.message {
    text-align: center;
    color: red;
}

.form-container {
    width: 600px;
    border: 1px solid #dedede;
    border-radius: 5px;
    margin: auto;
}

.form-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 50px;
    border: 1px solid #dfdfdf;
    border-radius: 3px;
    margin: 10px;
}

.form-row:hover {
    border-color: blue;
}

.form-row>label {
    flex-basis: 20%;
    text-align: right;
}

.form-row>input {
    flex-basis: 75%;
    border: none;
    outline: none;
}

.form-buttons {
    height: 50px;
    margin: 10px;
}

.form-buttons>button {
    height: 100%;
    width: 100%;
}